<div class="my-3 my-md-5">
  <div class="container">
    <div class="row">
      <div class="col-lg-4">
        <div class="card card-profile">
          <div class="card-header card-header-profile"></div>
          <div class="card-body text-center">
            <img class="card-profile-img" src="<%= @user.avatar.url %>">
            <h3 class="mb-3"><%= @user.nickname %></h3>
            <p class="mb-4">
              <%= @user.phone %>
            </p>
            <button class="btn btn-outline-primary btn-sm">
              <span class="fa fa-twitter"></span> <%= i18n_enum @user, :sex %>
            </button>
          </div>
        </div>
        <!--
        <div class="card">
          <div class="card-header">
            <h3 class="card-title">统计数据</h3>
          </div>
          <div class="card-body">
          </div>
        </div>
        -->
      </div>
      <div class="col-lg-8">
        <div class="card">
          <div class="card-header">
            <h3 class="card-title">统计数据</h3>
          </div>
          <div class="card-body">
            <div class="row">
              <div class="col-sm-4 col-lg-4">
                <div class="card p-3">
                  <div class="d-flex align-items-center">
                    <span class="stamp stamp-md bg-blue mr-3">
                      <i class="fe fe-dollar-sign"></i>
                    </span>
                    <div>
                      <h4 class="m-0"><a href="javascript:void(0)"><%= @user.orders.where(state: :checkouted).count %> <small>单成功支付</small></a></h4>
                      <small class="text-muted"><%= @user.orders.where(state: :pending).count %> 单等待支付</small>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-sm-4 col-lg-4">
                <div class="card p-3">
                  <div class="d-flex align-items-center">
                    <span class="stamp stamp-md bg-green mr-3">
                      <i class="fe fe-userping-cart"></i>
                    </span>
                    <div>
                      <h4 class="m-0"><a href="javascript:void(0)"><small>浏览过</small><%= @user.spu_tracks.count %> <small>个商品</small></a></h4>
                      <small class="text-muted"></small>
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-sm-4 col-lg-4">
                <div class="card p-3">
                  <div class="d-flex align-items-center">
                    <span class="stamp stamp-md bg-yellow mr-3">
                      <i class="fe fe-message-square"></i>
                    </span>
                    <div>
                      <h4 class="m-0"><a href="javascript:void(0)"><%= @user.comments.count %> <small>评论</small></a></h4>
                      <small class="text-muted"></small>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="card">
          <div class="card-header">
            <h3 class="card-title">会员资料</h3>
          </div>
          <div class="card-body">
            <div class="row row-cards">
              <div class="col-sm-6 col-lg-4">
                <label class="form-label">注册时间</label>
                <div class="form-control-plaintext"><%= formattime(@user.created_at, unit: "hour") %></div>
              </div>
              <div class="col-sm-6 col-lg-4">
                <label class="form-label">账户余额</label>
                <div class="form-control-plaintext"><%= @user.moneybag %></div>
              </div>
              <div class="col-sm-6 col-lg-4">
                <label class="form-label">会员等级</label>
                <div class="form-control-plaintext"><%= @user.membership.blank? ? "普通用户" : @user.membership.name %></div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>